<template>
  <b-container>
    <b-row>
      <b-col cols="4">
        <div>
          <sides />
        </div>
      </b-col>
      <b-col cols="8">
        <table class="type-table">
          <tr v-for="(news, index) in newsList" :key="index">
            <td><b-link :to="{ path: 'news', query: { id: news.id }}">{{ news.title }}</b-link></td>
            <td class="type-table-time">{{ news.lastUpdateDate | dateformat('YYYY/MM/DD') }}</td>
          </tr>
        </table>
      </b-col>
    </b-row>
  </b-container>
</template>

<script>

import { queryByType } from '@/api/news/index'
import sides from '@/components/sides'

export default {
  name: 'Index',
  components: {
    sides
  },
  data() {
    return {
      newsList: {},
      id: this.$route.query.id
    }
  },
  watch: {
    '$route.query.id'(v) {
      this.id = v
      this.init()
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      queryByType({
        id: this.id
      }).then(r => {
        const { data } = r
        this.newsList = data.content
      })
    }
  }
}
</script>

<style scoped>
.type-table {
  width: 100%;
}
  .type-table-time {
    width: 20%;
    text-align: right;
  }
</style>
